<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<%@ page contentType="text/html;charset=UTF-8" %>
<%@ include file="/WEB-INF/views/include/taglib.jsp"%>
<html>
<head>
	<title>区域管理</title>
	<%@include file="/WEB-INF/views/include/head.jsp" %>
	<script type="text/javascript">
		$(document).ready(function() {
			initGrid();//初始化表格
		});

	    /*初始化表格*/
	    function initGrid(){    	
	    	$("#jqGrid").jqGrid({
                url: '${ctxAdmin}/sys/area/loadData',
                mtype: "POST",
                datatype: "json",
                responsive:true,
                page: 1,
                colModel: [
		            { label: 'id', name: 'id', key: true, hidden:true},     
                    { label: '地区名称',name: 'name',index: 'a.name',width: 150},
                    { label: '地区编码', name: 'code',index: 'a.code',width:80},
/*                     { label: '区域类型', name: 'typeCn',index:'a.type', width: 150,
                    stype:"select",searchoptions:{sopt:['eq'],value:"${areaType}"}},
                   { label: '所属片区', name: 'regionCn',index:'a.region', width: 150,
                    stype:"select",searchoptions:{sopt:['eq'],value:"${regionType}"}},  */                
                    { label: '区域类型', name: 'typeValue',index:'a.type', width: 80},                            
                    { label: '地区备注', name: 'remarks',index:'a.remarks', width: 90 }, 
                    {label:'操作',name:'cz',search:false,sortable:false,title:false,formatter:czFmt,width:120}
                ],
				viewrecords: true,
                height: height,
                rowNum: 10,
                rowList:[10,20,30],
                loadonce:false,
                multiselect: true, // 显示多选复选框
                autowidth: true,
                pager: "#jqGridPager"
            });
			$('#jqGrid').jqGrid('navGrid','#jqGridPager',{edit:false,add:false,del:false,search:false});
			$(window).bind("resize",function(){var width=$(".jqGrid_wrapper").width();$("#jqGrid").setGridWidth(width);});
	    }

	    function czFmt(c,o,r){
			var res='';
			var id=r.id;
			res+='<shiro:hasPermission name="sys:area:edit">';
			res+='<a class="btn-success btn-sm" href="${ctxAdmin}/sys/area/form?id='+id+'">修改</a>&nbsp;&nbsp;';
			res+='<a class="btn-danger btn-sm" href="javascript:void(0)" onclick="deleteData(\''+id+'\')">删除</a>&nbsp;&nbsp;';
			res+='<a class="btn-success btn-sm" href="${ctxAdmin}/sys/area/form?parent.id='+id+'">添加下级</a>';
			res+='</shiro:hasPermission>';
			return res;
		}
	
		function deleteData(id){		
			confirmx('你确定要删除此数据吗？',null,function(){
					$.ajax({
					url:'${ctxAdmin}/sys/area/delete',
					type:'post',
					dataType:'json',
					data:{id:id},
					success:function(res){
					var code = res.code;
					var message = res.message;				
					layer.msg(message);
					$('#jqGrid').trigger("reloadGrid");
					}
				});
			});							
			
		}

		function deleteDataBatch(ids){
			var _ids=$('#jqGrid').jqGrid('getGridParam','selarrrow');
			if(_ids.length==0){
			layer.msg("请选择要操作的行！");
			return
			}
			var ids = _ids.join(",");
	
			confirmx('你确定要删除此数据吗？',null,function(){
					$.ajax({
					url:'${ctxAdmin}/sys/area/delete',
					type:'post',
					dataType:'json',
					data:{id:ids},
					success:function(res){
					var code = res.code;
					var message = res.message;				
					layer.msg(message);
					$('#jqGrid').trigger("reloadGrid");
					}
				});
				}		
			);			
							
			}
				
		$(function() {
			$('#btnSubmit').click(function() {
				var name = $("#name").val();
				var code = $("#code").val();
				var type = $("#type").val();
				$('#jqGrid').jqGrid('setGridParam', {
					datatype : 'json',
					postData : {
						'name' : name,
						'code' : code,
						'type':type
					}
				}).trigger("reloadGrid");
			});
		});
	</script>
</head>
<body>
	<ul class="nav nav-tabs">
		<li class="active"><a href="${ctxAdmin}/sys/area/">区域列表</a></li>
		<shiro:hasPermission name="sys:area:edit"><li><a href="${ctxAdmin}/sys/area/form">添加区域</a></li></shiro:hasPermission>
	</ul>
	<div class="jqGrid_wrapper">
		<div class="search_row">
		<form id="myForm">
			<label class="col-sm-1">地区名称：</label>
			<div class="col-sm-2">
				<input id="name" name="name" type="text"
					class="form-control ipt-search" />
			</div>
			<label class="col-sm-1">地区编码：</label>
			<div class="col-sm-2">
				<input id="code" name="code" type="text"
					class="form-control ipt-search" />
			</div>
			<label class="col-sm-1">区域类型：</label>
			<div class="col-sm-2">
				<select name="type" id="type" class="form-control ipt-search">
					<option value="">--请选择--</option>
					<c:forEach var="v" items="${typeList}">
						<option value="${v.value}">${v.label}</option>
					</c:forEach>
				</select>
				
				<!-- 需要引入spring-webmvc-xxx.jar -->
<%-- 				<form:select path="type size="20" multiple="true">
					<form:options items="${typeList}" itemLabel="label" itemValue="value"/>
				</form:select>	
				
				$('.select2-container').select2("val", ''); --%>
						
			</div>		
			<div class="col-sm-search">
				&nbsp;<input id="btnSubmit" class="btn btn-sm btn-success" type="button" value="查询" />
				&nbsp; <input id="btnReset" class="btn btn-sm btn-danger"  type="button" value="重 置" />
				<shiro:hasPermission name="sys:area:edit">
			 	&nbsp;<input id="btnDelete" class="btn btn-sm btn-danger" type="button" onclick="deleteDataBatch()" value="批量删除" />
				</shiro:hasPermission>
			</div>
		</form>
		</div>
		<div class="search_row_split"></div>
		<table id="jqGrid"></table>
		<div id="jqGridPager"></div>
	</div>
</body>
</html>